<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        body { margin: 0; padding: 0; position: relative; background:cornflowerblue; background-position: center; /*background-repeat: no-repeat;*/ width: 100%; height: 100%; background-size: 100% 100%; }

    </style>
</head>
<body onLoad="init()">

<script type="text/javascript" src="js/ThreeCanvas.js"></script>
<script type="text/javascript" src="js/Snow.js"></script>

<script type="text/javascript">
    var SCREEN_WIDTH = window.innerWidth;
    var SCREEN_HEIGHT = window.innerHeight;
    var container;
    var particle;//粒子

    var camera;
    var scene;
    var renderer;

    var starSnow = 1;

    var particles = [];

    var particleImage = new Image();
    particleImage.src = 'images/flower1.png';


    function init() {
        container = document.createElement('div');//container：画布实例;
        document.body.appendChild(container);

        camera = new THREE.PerspectiveCamera( 60, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 10000 );
        camera.position.z = 1000;

        scene = new THREE.Scene();
        scene.add(camera);

        renderer = new THREE.CanvasRenderer();
        renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
        var material = new THREE.ParticleBasicMaterial( { map: new THREE.Texture(particleImage) } );
        for (var i = 0; i < 20; i++) {
            //alert("message");
            particle = new Particle3D( material);
            particle.position.x = Math.random() * 2000-1000;

            particle.position.z = Math.random() * 2000-1000;
            particle.position.y = Math.random() * 2000-1000;
            //particle.position.y = Math.random() * (1600-particle.position.z)-1000;
            particle.scale.x = particle.scale.y =  1;
            scene.add( particle );
            particles.push(particle);
        }

        container.appendChild( renderer.domElement );

        setInterval( loop, 1000 / 60 );

    }

    var touchStartX;
    var touchFlag = 0;//储存当前是否滑动的状态;
    var touchSensitive = 80;//检测滑动的灵敏度;

    function loop() {
        for(var i = 0; i<particles.length; i++){
            var particle = particles[i];
            particle.updatePhysics();

            with(particle.position)
            {
                if((y<-1000)&&starSnow) {y+=2000;}

                if(x>1000) x-=2000;
                else if(x<-1000) x+=2000;
                if(z>1000) z-=2000;
                else if(z<-1000) z+=2000;
            }
        }

        camera.lookAt(scene.position);

        renderer.render(scene, camera );
    }
</script>
</body>
</html>
